<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>小米手机列表</title>
		<link rel="stylesheet" type="text/css" href="./css/style.css">
        <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.0/jquery.js"></script>
        <script type="text/javascript">

            const FINALLPHONE_URL = "http://localhost:8080/mi/findAllPone";

            const IMAGE_URL="./image/";
            let name;
            $(function () {
                name = localStorage.getItem("name");
                $("#dlname").text(name).attr("href","self_info.html");


                $(document).ready(function(){
                    $.post(FINALLPHONE_URL,function (all) {
                        if(all==null){
                            $("#msg").text("缺货 补货中。。。")
                        }


                        console.log(all);
                        for (const phone of all.date) {
                            $("#pvalue").append(
                                $('<div class="mingxing fl mb20" style="border:2px solid #fff;width:230px;cursor:pointer;" onmouseout="this.style.border=\'2px solid #fff\'" onmousemove="this.style.border=\'2px solid red\'">')
                                    .append(
                                        $('<div class="sub_mingxing">').append(
                                            //事件
                                            $('<a target="_blank" >').append(
                                                $("<img>").attr("src",IMAGE_URL+phone.image)
                                            ).attr("href","xiangqing.html?id="+phone.id)
                                        )
                                    ).append(
                                    $('<div class="pinpai">').append(
                                        $('<a target="_blank">').text(phone.name+"-"+phone.color)
                                    )
                                ).append(
                                    $('<div class="youhui">').text("正在火热销售中~")
                                ).append(
                                    $('<div class="jiage">').text(phone.price+"￥")
                                ).append(
                                    $('<div class="clear">')
                                )
                            )
                        }
                    })
                });

                //获取点击界面的值

            })



        </script>


	</head>
	<body>
	<!-- start header -->
		<header>
			<div class="top center">
				<div class="left fl">
					<ul>
						<li><a href="index.html" target="_blank">小米商城</a></li>
						<li>|</li>
						<li><a href="">MIUI</a></li>
						<li>|</li>
						<li><a href="">米聊</a></li>
						<li>|</li>
						<li><a href="">游戏</a></li>
						<li>|</li>
						<li><a href="">多看阅读</a></li>
						<li>|</li>
						<li><a href="">云服务</a></li>
						<li>|</li>
						<li><a href="">金融</a></li>
						<li>|</li>
						<li><a href="">小米商城移动版</a></li>
						<li>|</li>
						<li><a href="">问题反馈</a></li>
						<li>|</li>
						<li><a href="">Select Region</a></li>
						<div class="clear"></div>
					</ul>
				</div>
				<div class="right fr">
					<div class="gouwuche fr"><a href="gouwuche.html">购物车</a></div>
					<div class="fr">
						<ul>
							<li><a href="./login.html" id="dlname" target="_blank">登录</a></li>
							<li>|</li>
							<li><a href="./register.html" target="_blank" >注册</a></li>
							<li>|</li>
							<li><a href="">消息通知</a></li>
						</ul>
					</div>
					<div class="clear"></div>
				</div>
				<div class="clear"></div>
			</div>
		</header>
	<!--end header -->

<!-- start banner_x -->
		<div class="banner_x center">
			<a href="./index.html" target="_blank"><div class="logo fl"></div></a>
			<a href=""><div class="ad_top fl"></div></a>
			<div class="nav fl">
				<ul>
					<li><a href="">小米手机</a></li>
					<li><a href="">红米</a></li>
					<li><a href="">平板·笔记本</a></li>
					<li><a href="">电视</a></li>
					<li><a href="">盒子·影音</a></li>
					<li><a href="">路由器</a></li>
					<li><a href="">智能硬件</a></li>
					<li><a href="">服务</a></li>
					<li><a href="">社区</a></li>
				</ul>
			</div>
			<div class="search fr">
				<form action="" method="post">
					<div class="text fl">
						<input type="text" class="shuru"  placeholder="小米6&nbsp;小米MIX现货">
					</div>
					<div class="submit fl">
						<input type="submit" class="sousuo" value="搜索"/>
					</div>
					<div class="clear"></div>
				</form>
				<div class="clear"></div>
			</div>
		</div>
<!-- end banner_x -->

	<!-- start banner_y -->
	<!-- end banner -->

	<!-- start danpin -->
		<div class="danpin center">
			
			<div class="biaoti center">小米手机</div>
            <div>
			<div class="main center" id="pvalue">



            </div>
			<div class="main center mb20" >
			</div>
            </div>
		</div>
		

		<footer class="mt20 center" style="display: flex;justify-content: center;align-items: center;flex-direction: column;">
			<div class="mt20">小米商城|MIUI|米聊|多看书城|小米路由器|视频电话|小米天猫店|小米淘宝直营店|小米网盟|小米移动|隐私政策|Select Region</div>
			<div>©mi.com 京ICP证110507号 京ICP备10046444号 京公网安备11010802020134号 京网文[2014]0059-0009号</div> 
			<div>违法和不良信息举报电话：185-0130-1238，本网站所列数据，除特殊说明，所有数据均出自我司实验室测试</div>
		</footer>

	<!-- end danpin -->


	</body>
</html>